<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" >
<head>
    <th:block th:include="include :: header('新增卡池')" />
</head>
<body class="white-bg">
    <div class="wrapper wrapper-content animated fadeInRight ibox-content">
        <form class="form-horizontal m" id="form-cardPool-add">
            <div class="form-group">    
                <label class="col-sm-3 control-label"><span style="color: red; ">*</span>卡池名称：</label>
                <div class="col-sm-8">
                    <input name="cardName" class="form-control" type="text" maxlength="8" required>
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-3 control-label"><span style="color: red; ">*</span>所属：</label>
                <div class="col-sm-8">
                    <select name="cardScope" class="form-control m-b" th:with="type=${@dict.getType('card_scope')}" required>
                        <option value="">请选择</option>
                        <option th:each="dict : ${type}" th:text="${dict.dictLabel}" th:value="${dict.dictValue}"></option>
                    </select>
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-3 control-label"><span style="color: red; ">*</span>类型：</label>
                <div class="col-sm-8">
                    <select name="cardType" class="form-control m-b" th:with="type=${@dict.getType('card_type')}" required>
                        <option th:each="dict : ${type}" th:text="${dict.dictLabel}" th:value="${dict.dictValue}"></option>
                    </select>
                </div>
            </div>
            <div class="form-group">    
                <label class="col-sm-3 control-label"><span style="color: red; ">*</span>总数量：</label>
                <div class="col-sm-8">
                    <!--<input id="total" name="total" class="form-control" type="text" oninput="setValue()" maxlength="8" onkeyup="this.value=this.value.replace(/\D|^0/g,'')" onafterpaste="this.value=this.value.replace(/\D|^0/g,'')" required>-->
                    <input id="total" name="total" class="form-control" type="text" value="0" maxlength="8" readonly>
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-3 control-label"><span style="color: red; ">*</span>提醒余量：</label>
                <div class="col-sm-8">
                    <input name="warnRemainder" class="form-control" type="text" maxlength="8" required>
                </div>
            </div>
            <div class="form-group">    
                <label class="col-sm-3 control-label">预估余量：</label>
                <div class="col-sm-8">
                    <input id="predictRemainder" name="predictRemainder" class="form-control" type="text" value="0" maxlength="8" readonly>
                </div>
            </div>
            <div class="form-group">    
                <label class="col-sm-3 control-label">实际余量：</label>
                <div class="col-sm-8">
                    <input id="actualRemainder" name="actualRemainder" class="form-control" type="text" value="0" maxlength="8" readonly>
                </div>
            </div>
        </form>
    </div>
    <th:block th:include="include :: footer" />
    <script type="text/javascript">
        var prefix = ctx + "tencent/cardPool"
        $("#form-cardPool-add").validate({
            focusCleanup: true
        });

        function submitHandler() {
            if ($.validate.form()) {
                $.operate.save(prefix + "/add", $('#form-cardPool-add').serialize());
            }
        }

        function setValue() {
            var total = document.getElementById('total').value; //获取第一个输入框的值
            if ($.common.isEmpty(total)) {  //如果为非数字，结果为空
                document.getElementById('predictRemainder').value = "";
                document.getElementById('actualRemainder').value = "";
            } else {
                document.getElementById("predictRemainder").value = total;
                document.getElementById("actualRemainder").value = total;
            }
        }
    </script>
</body>
</html>